<template>
	<view class="add page c00">
		<view class="bgf7 p12">
			<view class="bgff px14 pb10">

				<view class="flex flexC borb py12">
					<text class="flex1">券名</text>
					<input type="text" v-model="data.sku_name" disabled="disable" class="py3 aliR" />
				</view>


				<view class="flex flexC borb py12">
					<text class="flex1">消费店铺</text>
					<input type="text" v-model="data.shop_name" disabled="disable" class="py3 aliR" />
				</view>


				<view class="flex flexS borb pb12 pt18" @click="$refs.popup3.open()">
					<text class="mr14 pt3" v-if="type == 'qp'">选择包厢</text>
					<text class="mr14 pt3" v-else>选择台桌</text>
					
					<view class="flex aliR flexB flexW flex1" style="margin-left: 42%;">
						{{currentRoom.name}}
					</view>
					<text class="arrowR ml3"></text>

				</view>

				<view class="flex flexC borb py12">
					<text class="flex1">抵扣时长</text>
					<input type="digit" v-model="data.hour" disabled="disable" placeholder="抵扣时长" class="py3 aliR" />小时
				</view>

				<view class="flex flexC borb py12">
					<text class="flex1">日期</text>

					<view class="flex aliR flexC flexW flex1">
						{{data.weekStr}}
					</view>
				</view>

				<view class="flex flexC borb py12">
					<text class="flex1">使用时间</text>
					<input type="digit" v-model="data.time" disabled="disable" placeholder="抵扣时长" class="py3 aliR" />
				</view>

			</view>
			<view class="flex flexC flexJC py20">
				<view @click="check" class="aliC py12 w-17 bgf6c r40">去预定消费</view>
			</view>
		</view>

		<uni-popup ref="popup3" type="bottom">
			<view class="popup-content2">
				<view v-for="item in data.roomList" class="popup-btn" @click="selectRoom(item)">{{item.name}}</view>
			</view>

		</uni-popup>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				mt_id: '',
				data: null,
				currentRoom: null,
				type:'',
				couponType:'',
				room_id:'',
				is_room_exists:false
			};
		},
		onLoad(option) {

			this.mt_id = option.id;
			if(option.room_id == undefined){
				this.room_id = ''
			}else{
				this.room_id = option.room_id;
			}
			console.log('=======抖音券的详情界面的包厢ID==========:'+ this.room_id);
			
			this.couponType = option.type;
			this.getDetail();
		},

		onShow() {

		},
		methods: {

			check() {
				let date = new Date();
				let h = date.getHours(); //获取小时
				let m = date.getMinutes(); //获取分钟

				var year = date.getFullYear();

				var month = date.getMonth() + 1;

				var day = date.getDate();

				month = (month > 9) ? month : ("0" + month);
				day = (day < 10) ? ("0" + day) : day;
				var today = year + "-" + month + "-" + day;

				var startTime = h + ":" + m;
				var obj = new Object();
				obj.shop_id = this.data.shop_id;
				obj.id = this.currentRoom.id;
				obj.hour = this.data.hour;
				obj.startDate = today;
				obj.startTime = startTime;
				obj.couponName = this.data.sku_name;
				obj.douCode = this.data.dou_code;
				
				
				if (this.type == 'tq') {
				
					this.bookTq(obj);
				
				} else {
					
					if(this.data.hour == 1){
						
						uni.showToast({
							title:"此券是续时券，只能用于续时",
							icon:'none'
							
						})
						return;
					}
					
					if(this.couponType == 'ks'){
						uni.navigateTo({
							url: '../order/submit?ks=' + JSON.stringify(obj)
						})
					}else{
						uni.navigateTo({
							url: '../order/submit?dou=' + JSON.stringify(obj)
						})
					}
				
				}
			

			},
			
			bookTq(obj){
				
			
				let param = {
					id: obj.id,
					dou_code:obj.douCode
				};
				
				if(this.couponType == 'ks'){
					param = {
						id: obj.id,
						ks_code:obj.douCode
					};
				}
				
				let that = this;
				this.$api.tableAddOrder(param).then(res => {
					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.order_no = res.data.order_no;
						uni.redirectTo({
							url: '../order/tableDetail?order_no=' + that.order_no
						})
					} else {
						uni.showToast({
							icon: "none",
							title: res.msg
						})
					}
				
				})
			},
			
			selectRoom(item) {
				this.currentRoom = item;
				this.$refs.popup3.close();
			},


			getDetail() {
				let param = {
					id: this.mt_id,
					room_id:this.room_id,
					type:this.couponType
				};
				let that = this;
				this.$api.douUserCodeDetail(param).then(res => {

					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.data = res.data;
						if(res.data.is_room_exists == false && that.room_id != ''){
							uni.showModal({
								showCancel:false,
								title:'提示',
								content:'该券与当前选择包厢不匹配，可以重新选择其他包厢使用',
								complete:function(){
									
								}
							})
						}
						that.type = res.data.type;
						that.currentRoom = res.data.roomList[0];
					} else {
						
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.add {
		.w48 {
			width: 96rpx;
			height: 96rpx;
		}

		.imgbox {
			width: 164rpx;
			height: 164rpx;
			background-color: #E8E8E8;
			position: relative;

			image {
				width: 100%;
				height: 100%;
			}

			.del {
				width: 36rpx;
				height: 36rpx;
				background: rgba(181, 180, 180, .8);
				position: absolute;
				top: -12rpx;
				right: -12rpx;
			}
		}
	}

	.popup-content2 {
		background: #FFFFFF;

		.popup-btn {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
		}

		.button {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
			font-size: 11pt;
		}

		button::after {
			border: none;
		}

		.pt20 {
			border-bottom: 20rpx solid #f5f5f5;
		}
	}
</style>